import ReactDOM from 'react-dom'
import React, { Component, createRef } from 'react'

class App extends Component {
  // 获取非受控组件的值
  // 1.通过createRef创建一个ref对象
  // 2.给元素绑定ref属性值为创建ref对象
  // 3.通过ref对象的current获取元素,在获取他的值 .value
  mobileRef = createRef()
  getMobile = () => {
    console.log(this.mobileRef);//通过ref对象拿到绑定的元素
    console.log(this.mobileRef.current);//目标元素
    console.log(this.mobileRef.current.value);
  }
  render() {
    return (
      <div>
        <input type="text" ref={this.mobileRef} placeholder="请输入手机号" />
        <button onClick={this.getMobile}>获取非受控组件的值</button>
      </div>
    )
  }
}

ReactDOM.render(<App />, document.getElementById('root'))